<template>
	<vCommonPage title subTitle="自助服务系统" type="0" v-if="homeShow" class="home">
		<div slot="customContent" style="padding: 0 0px;width: 100%;height: 100%;">
			<!-- start:自定义页面内容 -->
			<!-- <div v-if="sceneid=='sstbg'" style="height:300px;background-color:#918;"></div> -->
			<!-- <div v-if="sceneid=='sstbg'" style="width:100%;height:768px;"></div> -->
			<div class="cardBox">
				<div :class="cardBoxItemObj" v-for="(item, index) in operationalMatters" :key="index">
					<el-card @click.native="gotoPage(item)" :class="cardStyleObj">
						<img :src="item.url" :class="iconObj" />
						<!-- </div> -->
						<h1 :class="nameObj">{{item.name}}</h1>
						<h2 :class="bottomObj">{{item.egName}}</h2>
					</el-card>
				</div>
			</div>
			<!-- end:自定义页面内容 -->
		</div>
	</vCommonPage>
</template>

<script>
	import {
		checkversion,
		commonGet
	} from "@api/data"
	import {
		getHomePage
	} from "@api/apiBox/scene"
	import {
		getHomeConf
	} from "@api/apiBox/terminal"
	import {
		CK80Printer
	} from '@api/tools/Hardware.js'
	export default {
		name: "Home",
		props: [],
		components: {},
		data() {
			return {
				operationalMatters: this.$store.state.terminfo.funcinfo,
				// operationalMatters: [],
				sceneid: this.$store.state.terminfo.seceninfo.sceneid,
				cmiid: this.$store.state.terminfo.orginfo.cmiid,
				// printer: new CK80Printer(),
				homeList: [],
				homeShow: false,
				//检查版本号定时器
				timerhandle: ''
			};
		},

		methods: {
			istolong(data) {
				if (data.length > 10) {
					return true;
				} else {
					return false;
				}
			},
			clear() {
				//读业务初始阶段，清空vuex除终端信息外 所有存储，防止出错。
				this.$store.dispatch("user/updateuserinfo", "");
				this.$store.dispatch("user/updatemiinfo", "");
				this.$store.dispatch("appointment/updateAppointmentInfo", "");
				this.$store.dispatch("appointment/clearData");
				this.$store.dispatch("payrecord/updatepayinfo", "");
				this.$store.dispatch("recipel/updateinvoiceNo", "");
				this.$store.dispatch("recipel/updateRecordsInfo", "");
				this.$store.dispatch("recipel/updateErCodeInfo", "");
				this.$store.dispatch("recipel/updateBillInfo", "");
				this.$store.dispatch("route/updatePreStageEnd", "");
				this.$store.dispatch('payCard/updateCardNo', '')
				this.$store.dispatch('zndz/updateZndzDatas')
				this.$store.dispatch("yyjj/updateDeptId", ""); //清除存储科室ID信息
				this.$store.dispatch("yyjj/updateDoctorId", ""); //清除存储医生ID信息
				this.$store.dispatch("terminfo/updatecardConfs", ""); // 卡片信息
				this.$store.dispatch("terminfo/updatepayConfs", ""); // 支付信息
				this.$store.dispatch("user/updateZzqhInfo", ""); //自助取号信息
			},
			gotoPage(item) {
				console.log(item, 'item')
				// //存储刷卡类型数据
				// this.$store.dispatch("terminfo/updatecardConfs", item.kyklx); // 卡片信息
				// //存储支付类型数据
				// this.$store.dispatch("terminfo/updatepayConfs", item.zffs); // 支付信息
				console.log(item, '带年纪')
				let num = item.num.toUpperCase()
				if (num == 'JGCX' || num == 'ZNDZ' || num == 'MYDDC' || num == 'YYJJ' || num ==
					'YSJJ') {
					this.$router.push({
						name: item.num,
						query: {
							pageName: item.num,
							name: item.name
						},
					});
				} else {
					this.$router.push({
						name: 'xzskfs',
						query: {
							pageName: item.num,
							name: item.name
						},
					});
				}

			},
			async getInit(item) {
				var status = '0' //await this.printer.GetStatus();
				console.log("打印机状态=" + status);
				if (status != '0' && status != '2' && val != 'bgdy') {
					this.$alert(status);
				} else {
					this.choicefunction(item);
				}
			},
			choicefunction(item) {
				console.log("item=" + item);
				var val = item.funcCode;
				let logintype = item.loginConfs;
				this.clear();
				if (val == "zzfk") {
					// 跳到读身份证界面
					this.$router.push({
						name: "archives",
						query: {
							pageTitle: "请刷身份证",
							id: val
						},
					});
				} else if (val == "other") {
					//  this.$router.push({ name: "printreport" });
					this.$alert("暂未开通", "提示：", {
						confirmButtonText: "确定",
						callback: (action) => {
							if (action == "confirm" || action == "cancel") {
								// this.$store.commit("alteruserinfo", "");
								this.$router.push({
									name: "home"
								});
							}
						},
					});
				} else if (val == "zycz") {
					this.$router.push({
						name: "zycz",
						query: {
							pageTitle: "请输入住院信息",
							id: val
						},
					});
				} else if (val == "qdcx") {
					this.$router.push({
						name: "qdcx",
						query: {
							pageTitle: "请输入住院信息",
							id: val
						},
					});
				} else {
					// 先跳到读卡界面
					this.$router.push({
						name: "readcard",
						query: {
							pageTitle: "选择刷卡方式",
							id: val,
							logintype: logintype
						},
					});
				}
			},
			//检查版本号
			checkverison() {
				if (this.destroyed) {
					return; // 防止页面关闭后 继续调用
				}
				var localVerNum = this.$store.state.terminfo.terminfo.signature; //启动时存在本地的版本号
				console.log("本地版本号：", localVerNum);
				let data = {};
				data.url = "/api/sst/conf/GetVerNum";
				data.payload = {};
				checkversion(data).then((res) => {
					var serVerNum = res.data;
					console.log("最新版本号：", serVerNum);
					if (serVerNum != localVerNum) { //本地版本号与获取到的最新版本号不一致的，重新加载
						this.$router.push({
							name: "homepage"
						});
					} else {
						this.timerhandle = setTimeout(() => this.checkverison(), 300000); //设置5分钟延迟,版本号一致的延迟后继续查询
					}
				});
			},
			async initData() {
				if (this.$store.state.terminfo) {
					this.homeShow = true;
					if (this.$store.state.terminfo.funcinfo.length == 0) {
						this.$router.push({
							name: "homepage"
						});
					}
					console.log(this.$store.state.terminfo.funcinfo, '查询主页面医院配置--home')
					console.log(this.$store.state.terminfo.loginConfs, '自助机支持刷卡类型')
				}
			},
		},
		mounted() {
			console.log("clear all");
			this.clear();
			console.log("clear all-end");
			// this.timerhandle = setTimeout(() => this.checkverison(), 20000);
		},
		created() {
			
			//获取首页配置
			this.initData();
			//添加模块
			// this.operationalMatters.push(this.operationalMatters[0])
			console.log(this.$store.state.terminfo.funcinfo, '终端配置信息')
			this.$store.dispatch("route/updateLoading", false); //停止加载
		},
		computed: {
			cardBoxItemObj: function() {
				return {
					cardBoxItem: this.operationalMatters.length <= 6,
					cardBoxItemM7: this.operationalMatters.length >= 7 && this.operationalMatters.length < 9,
					cardBoxItemM9: this.operationalMatters.length >= 9
				}
			},
			iconObj: function() {
				return {
					"item-icon": this.operationalMatters.length <= 6,
					"item-icon-m7": this.operationalMatters.length >= 7 && this.operationalMatters.length < 9,
					"item-icon-m9": this.operationalMatters.length >= 9
				}
			},
			nameObj: function() {
				return {
					"item-name": this.operationalMatters.length <= 6,
					"item-name-m7": this.operationalMatters.length >= 7 && this.operationalMatters.length < 9,
					"item-name-m9": this.operationalMatters.length >= 9
				}
			},
			bottomObj: function() {
				return {
					"item-btomText": this.operationalMatters.length <= 6,
					"item-btomText-m7": this.operationalMatters.length >= 7 && this.operationalMatters.length < 9,
					"item-btomText-m9": this.operationalMatters.length >= 9
				}
			},
			cardStyleObj: function() {
				return {
					"cardStyle": this.operationalMatters.length <= 6,
					"cardStyle-m7": this.operationalMatters.length >= 7 && this.operationalMatters.length < 9,
					"cardStyle-m9": this.operationalMatters.length >= 9
				}
			}
		},
		//离开当前路由，会直接调用
		beforeDestroy() {
			if (this.timerhandle != null) {
				//清空版本号查询定时器
				clearTimeout(this.timerhandle);
				this.timerhandle = null;
			}
			this.destroyed = true;
		},
	};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
	@import "../assets/css/home.scss";

	@media (min-height: 0px) and (max-height: 1910px) {
		.cardBox {
			font-size: 16px;
			color: black;
			justify-content: center;
			width: 100%;
			display: flex;
			flex-wrap: wrap;
			overflow-y: auto;
			align-items: center;
			// height: 770px;
		}

		.cardBox img {
			object-fit: contain;
		}
	}

	@media (min-height: 1919px) {
		.cardBox {
			font-size: 16px;
			color: black;
			justify-content: center;
			width: 100%;
			display: flex;
			flex-wrap: wrap;
			overflow-y: auto;
			height: 770px;
		}

	}

	.cardBoxItem {
		width: 30%;
		margin: 15px;
	}

	.cardStyle {
		text-align: center;
		height: 350px;
	}

	.cardBoxItemM7 {
		width: 21%;
		margin: 15px;
		margin-top: 25px;
		box-shadow: 0px 1px 16px 0px rgba(42, 103, 177, 0.09);
		border-radius: 8px;
		margin-bottom: 32px;
	}

	.cardBoxItemM9 {
		width: 25.457144rem;
		margin: 15px;
	}

	.item-icon-m7 {
		width: 7.585714rem;
		height: 89px;
		margin-top: 55px;
	}

	.item-icon-m9 {
		height: 89px;
		width: 89px;
		margin-top: 4px;
	}

	.item-icon {
		margin: 27px;
		width: 120px;
		height: 120px;
	}

	.item-name-m7 {
		text-align: center;
		margin: 0px 0px;
		margin-top: 25px;
		font-size: 23px;
		font-weight: 400;
		color: #435C7A;
		padding-bottom: 10%;
		font-family: Source Han Sans CN;
	}

	.item-name-m9 {
		text-align: center;
		margin: 0px 0px;
		margin-top: 15px;
		font-size: 23px;
		font-weight: 400;
		color: #435C7A;
		margin-bottom: 10px;
		font-family: Source Han Sans CN;
	}


	.item-name {
		text-align: center;
		margin: 10px 0px;
		margin-bottom: 17px;
		font-size: 23px;
		font-weight: 400;
		color: #435C7A;
		font-family: Source Han Sans CN;
	}

	.item-btomText {
		text-align: center;
		font-size: 1.714285rem;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #AEBBCB;
	}

	.item-btomText-m7 {
		text-align: center;
		font-size: 1.2rem;
		font-family: Source Han Sans CN;
		font-weight: 400;
		padding-bottom: 8%;
		color: #AEBBCB;
	}

	.item-btomText-m9 {
		text-align: center;
		font-size: 1.2rem;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #AEBBCB;
	}

	.cardStyle-m9 {
		height: 217px;
		text-align: center;
	}

	.cardStyle-m7 {
		height: 317px;
		text-align: center;
	}
</style>
<style>
	.el-card {
		box-shadow: 0px 1px 16px 0px rgba(42, 103, 177, 0.09);
		border-radius: 8px;
	}

	.home .el-row-verticalLow {
		height: calc(100% - 120px);
	}
</style>
